class MVue {
  constructor($options) {
    this.$options = $options;
    this.$data = $options.data;
    this.observe(this.$data);
    $options.created.call(this);
    // 编译
    new Compile($options.el, this);
  }
  observe(data) {
    if (!data || typeof data !== "object") {
      return;
    }
    if (Array.isArray(data)) {
      // 只修改需要数据劫持的数组的7种方法
      data.__proto__ = arrMethods;
    }
    Object.keys(data).forEach((key) => {
      // 数据劫持
      this.defineReactive(data, key, data[key]);
      // 代理，我们可以通过this访问和修改data中的数据
      this.proxyData(key);
    });
  }

  defineReactive(data, key, value) {
    // 如果val是对象执行递归
    this.observe(value);
    const dep = new Dep();
    arrayNotify(dep);
    Object.defineProperty(data, key, {
      get() {
        Dep.target && dep.addDep(Dep.target);
        return value;
      },
      set(newVal) {
        if (value === newVal) {
          return;
        }
        value = newVal;
        dep.notify();
      },
    });
  }
  proxyData(key) {
    Object.defineProperty(this, key, {
      get() {
        return this.$data[key];
      },
      set(newVal) {
        this.$data[key] = newVal;
      },
    });
  }
}
class Dep {
<<<<<<< HEAD
    constructor() {
        this.deps = []
    }
    addDep(dep) {
        this.deps.push(dep)
    }
    notify() {
        this.deps.forEach(dep => {
            dep.update()
        })
    }
=======
  constructor() {
    this.deps = [];
  }
  addDep(dep) {
    this.deps.push(dep);
  }
  notify() {
    console.log(111);
    this.deps.forEach((dep) => {
      dep.update();
    });
  }
>>>>>>> b05c8a7ca92a16591e144c06205d9d2c2c5febd3
}

class Watcher {
  constructor(vm, key, cb) {
    this.vm = vm;
    this.key = key;
    this.cb = cb;
    Dep.target = this;
    $operationObj.getObjKey(this.vm, this.key); //触发getter，添加依赖，proxyData
    Dep.target = null;
  }
  update() {
    this.cb.call(this.vm, $operationObj.getObjKey(this.vm, this.key));
  }
}
